<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:comps="http://java.sun.com/jsf/composite/comps"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="layout.xhtml">
        <ui:define name="body">

            <link rel='stylesheet prefetch' href='media/css/photoswipe.css'/>
            <link rel='stylesheet prefetch' href='media/css/default-skin.css'/>

            <p:growl id="messages" showDetail="false" autoUpdate="true"  /> 

            <h:form id="form" enctype="multipart/form-data">

                <p:panel styleClass="container_24 clearfix both ">

                    <h3>Inscrição Cadastral : #{managerAtualizarImovel.inscricaoCadastral(managerAtualizarImovel.imovelMerge.imInclusao)}</h3>
                    <h4>Marque <span style="font-weight: bold;">Sim</span> para aceitar a alteração do campo correspondente.</h4>

                    <br/>

                    <div style="#{managerAtualizarImovel.imovelMerge.campos.size() eq 0 ? 'display: none;' : ''}">
                        <ui:repeat value="#{managerAtualizarImovel.imovelMerge.campos}" var="campo">
                            <comps:displayDiff campo="#{campo}"/>
                        </ui:repeat>
                        <br/>
                    </div>

                    <fieldset style="#{managerAtualizarImovel.imovelMerge.enderecoIncluido eq null ? 'display: none;' : ''}">                                 
                        <legend>Endereço Incluído</legend>
                        <p:panel styleClass="container_24 clearfix">

                            <p:outputLabel value="CEP" styleClass="grid_3"/>
                            <p:inputMask styleClass="grid_4" mask="99.999-999"
                                         value="#{managerAtualizarImovel.imovelMerge.enderecoIncluido.cep}" readonly="true" />

                            <p:outputLabel value="Usar este endereço" style="font-weight: bold;" styleClass="prefix_5 grid_5"/>
                            <p:selectBooleanCheckbox value="#{managerAtualizarImovel.imovelMerge.usarEnderecoIncluido}" styleClass="grid_1"/>
                            <div class="clear-both" />

                            <p:outputLabel value="Logradouro" styleClass="grid_3" />
                            <p:inputText styleClass="grid_19" readonly="true"
                                         value="#{managerAtualizarImovel.imovelMerge.enderecoIncluido.nomeclog eq null or managerAtualizarImovel.imovelMerge.enderecoIncluido.nomeclog eq '' ? 
                                                  managerAtualizarImovel.imovelMerge.enderecoIncluido.logradouro : managerAtualizarImovel.imovelMerge.enderecoIncluido.nomeclog}" />

                            <div class="clear"/>
                            <p:outputLabel value="Bairro" styleClass="grid_3" />
                            <p:inputText styleClass="grid_19" readonly="true"
                                         value="#{managerAtualizarImovel.imovelMerge.enderecoIncluido.bairroDne.nome}" />

                            <p:outputLabel value="Número" styleClass="grid_3" />
                            <p:inputText styleClass="grid_4" readonly="true"
                                         value="#{managerAtualizarImovel.imovelMerge.enderecoIncluido.numero}" />

                            <p:outputLabel value="Complemento" styleClass="grid_5 alpha" />
                            <p:inputText styleClass="grid_10" readonly="true"
                                         value="#{managerAtualizarImovel.imovelMerge.enderecoIncluido.compl}" />

                        </p:panel>
                    </fieldset>

                    <fieldset style="#{(managerAtualizarImovel.imovelMerge.cEndereco eq null or
                                       (managerAtualizarImovel.imovelMerge.cEndereco ne null and managerAtualizarImovel.imovelMerge.cEndereco.size() eq 0)) ? 'display: none;' : ''}">
                        <legend>Endereço Imóvel</legend>
                        <div class="clear"/>
                        <ui:repeat value="#{managerAtualizarImovel.imovelMerge.cEndereco}" var="campo">
                            <comps:displayDiff campo="#{campo}"/>
                        </ui:repeat>
                    </fieldset>

                    <fieldset style="#{managerAtualizarImovel.imovelMerge.endCorrespIncluido eq null ? 'display: none;' : ''}">                                 
                        <legend>Endereço Correspondência Incluído</legend>
                        <p:panel styleClass="container_24 clearfix">

                            <p:outputLabel value="CEP" styleClass="grid_3" />
                            <p:inputMask styleClass="grid_4" mask="99.999-999"
                                         value="#{managerAtualizarImovel.imovelMerge.endCorrespIncluido.cep}" readonly="true" />
                            <p:outputLabel value="Usar este endereço" style="font-weight: bold;" styleClass="prefix_5 grid_5"/>
                            <p:selectBooleanCheckbox value="#{managerAtualizarImovel.imovelMerge.usarEndCorrespIncluido}" styleClass="grid_1"/>
                            <div class="clear-both" />

                            <p:outputLabel value="Logradouro" styleClass="grid_3" />
                            <p:inputText styleClass="grid_19" readonly="true"
                                         value="#{managerAtualizarImovel.imovelMerge.endCorrespIncluido.nomeclog eq null or managerAtualizarImovel.imovelMerge.endCorrespIncluido.nomeclog eq '' ? 
                                                  managerAtualizarImovel.imovelMerge.endCorrespIncluido.logradouro : managerAtualizarImovel.imovelMerge.endCorrespIncluido.nomeclog}" />
                            <div class="clear"/>
                            <p:outputLabel value="Bairro" styleClass="grid_3" />
                            <p:inputText styleClass="grid_19" readonly="true"
                                         value="#{managerAtualizarImovel.imovelMerge.endCorrespIncluido.bairroDne.nome}" />

                            <p:outputLabel value="Número" styleClass="grid_3" />
                            <p:inputText styleClass="grid_4" readonly="true"
                                         value="#{managerAtualizarImovel.imovelMerge.endCorrespIncluido.numero}" />

                            <p:outputLabel value="Complemento" styleClass="grid_5 alpha" />
                            <p:inputText styleClass="grid_10" readonly="true"
                                         value="#{managerAtualizarImovel.imovelMerge.endCorrespIncluido.compl}" />

                        </p:panel>
                    </fieldset>

                    <fieldset style="#{(managerAtualizarImovel.imovelMerge.cEnderecoCorresp eq null 
                                       or (managerAtualizarImovel.imovelMerge.cEnderecoCorresp ne null and managerAtualizarImovel.imovelMerge.cEnderecoCorresp.size() eq 0)) 
                                       ? 'display: none;' : ''}">
                        <legend>Endereço Correspondência</legend>
                        <div class="clear"/>
                        <ui:repeat value="#{managerAtualizarImovel.imovelMerge.cEnderecoCorresp}" var="campo">

                            <comps:displayDiff campo="#{campo}"/>
                        </ui:repeat>
                    </fieldset>

                    <fieldset style="#{managerAtualizarImovel.imovelMerge.anexosIncluidos.size() eq 0 ? 'display: none;' : ''}" >                                 
                        <legend>Anexos Incluídos</legend>

                        <ui:repeat  value="#{managerAtualizarImovel.imovelMerge.anexosIncluidos}" var="a">
                            <p:selectBooleanCheckbox value="#{a.usarAlteracao}" styleClass="ui-button button-select" />
                            <div class="my-simple-gallery" >
                                <figure itemprop="associatedMedia" class="grid_3">
                                    <a href="#{managerImagem.urlImagem(a.vlrAlteracao)}" 
                                       itemprop="contentUrl" data-size="#{managerImagem.widthHeight(a.vlrAlteracao)}">
                                        <img src="#{managerImagem.urlThumbnailImagem(a.vlrAlteracao)}" 
                                             itemprop="thumbnail" class="image"/>
                                    </a>
                                    <figcaption itemprop="caption description">#{a.vlrAlteracao.nomeExibicao}</figcaption>
                                </figure>
                            </div>
                        </ui:repeat>
                        <div class="clear"/>
                    </fieldset>


                    <fieldset style="#{managerAtualizarImovel.imovelMerge.proprietariosIncluidos.size() eq 0 ? 'display: none;' : ''}">                                 
                        <legend>Proprietários Incluídos</legend>
                        <p:panel id="proprietarioPanel" styleClass="container_24 clearfix ">

                            <p:dataTable id="tableProprietario" var="item" value="#{managerAtualizarImovel.imovelMerge.proprietariosIncluidos}" 
                                         styleClass="grid_24" 
                                         emptyMessage="Nenhum registro">  
                                <f:facet name="header">
                                    Nome do Proprietário ou Detentor
                                </f:facet>


                                <p:column width="20">
                                    <p:selectBooleanCheckbox value="#{item.usarAlteracao}" styleClass="chkbox-prop"/>
                                </p:column>
                                <p:column headerText="Ação" width="50">
                                    <p:commandButton oncomplete="dlgProp.show()" icon="ui-icon-search"
                                                     update=":proprietarioForm">
                                        <f:setPropertyActionListener target="#{managerProprietario.proprietario}" value="#{item.vlrAlteracao}" />
                                        <f:setPropertyActionListener target="#{managerProprietario.readonly}" value="#{true}" />
                                    </p:commandButton>

                                </p:column>

                                <p:column headerText="Nome">  
                                    #{item.vlrAlteracao.tipoDocumento eq 'CPF' ? item.vlrAlteracao.nome : item.vlrAlteracao.nomeFantasia ne null ? item.vlrAlteracao.nomeFantasia : item.vlrAlteracao.nome}
                                </p:column>

                                <p:column headerText="Documento" width="50">  
                                    #{managerPesquisarImovel.mascaraCpfCnpj(item.vlrAlteracao)}
                                </p:column> 

                            </p:dataTable>

                        </p:panel>
                    </fieldset>

                    <div style="#{managerAtualizarImovel.imovelMerge.proprietariosMerge.size() eq 0 || !managerAtualizarImovel.imovelMerge.propMergeDisplay ? 'display: none;' : ''}">
                        <fieldset style="#{managerAtualizarImovel.imovelMerge.proprietariosMerge.size() eq 0 ? 'display: none;' : ''}">
                            <legend>Proprietários</legend>
                        </fieldset>

                        <ui:repeat value="#{managerAtualizarImovel.imovelMerge.proprietariosMerge}" var="pm">
                            <div style="#{pm.temDiferenca ? '' : 'display: none;'}">
                                <h4 class="title">Proprietário #{pm.propInclusao.formatedDocument()}</h4>

                                <ui:repeat value="#{pm.campos}" var="campo">
                                    <comps:displayDiff campo="#{campo}"/>
                                </ui:repeat>

                                <fieldset style="#{pm.enderecoIncluido eq null ? 'display: none;' : ''}">                                 
                                    <legend>Endereço Incluído - Proprietário </legend>
                                    <p:panel styleClass="container_24 clearfix">

                                        <p:outputLabel value="CEP" styleClass="grid_3" />
                                        <p:inputMask styleClass="grid_4" mask="99.999-999"
                                                     value="#{pm.enderecoIncluido.cep}" readonly="true" />

                                        <p:outputLabel value="Usar este endereço" style="font-weight: bold;" styleClass="prefix_5 grid_5"/>
                                        <p:selectBooleanCheckbox value="#{pm.usarEnderecoIncluido}" styleClass="grid_1"/>
                                        <div class="clear-both" />

                                        <p:outputLabel value="Logradouro" styleClass="grid_3" />
                                        <p:inputText styleClass="grid_19" readonly="true"
                                                     value="#{pm.enderecoIncluido.nomeclog eq null or pm.enderecoIncluido.nomeclog eq '' ? 
                                                              pm.enderecoIncluido.logradouro : pm.enderecoIncluido.nomeclog}" />

                                        <div class="clear"/>
                                        <p:outputLabel value="Bairro" styleClass="grid_3" />
                                        <p:inputText styleClass="grid_19" readonly="true"
                                                     value="#{pm.enderecoIncluido.bairroDne.nome}" />

                                        <p:outputLabel value="Número" styleClass="grid_3" />
                                        <p:inputText styleClass="grid_4" readonly="true"
                                                     value="#{pm.enderecoIncluido.numero}" />

                                        <p:outputLabel value="Complemento" styleClass="grid_5 alpha"/>
                                        <p:inputText styleClass="grid_10" readonly="true"
                                                     value="#{pm.enderecoIncluido.compl}" />
                                    </p:panel>
                                </fieldset>

                                <fieldset style="#{(pm.cEndereco eq null or (pm.cEndereco ne null and pm.cEndereco.size() eq 0)) ? 'display: none;' : ''}">
                                    <legend>Endereço - Proprietário</legend>

                                    <ui:repeat value="#{pm.cEndereco}" var="campo">
                                        <comps:displayDiff campo="#{campo}"/>
                                    </ui:repeat>
                                </fieldset>


                                <fieldset style="#{pm.anexosIncluidos.size() eq 0 ? 'display: none;' : ''}" >                                 
                                    <legend>Anexos Incluídos - Proprietário </legend>

                                    <ui:repeat  value="#{pm.anexosIncluidos}" var="an" varStatus="i">
                                        <p:selectBooleanCheckbox value="#{an.usarAlteracao}" styleClass="ui-button button-select" />
                                        <!--                                    <p:commandButton value="" styleClass="button-select button-check" immediate="true" 
                                                                                             actionListener="#
                                        {managerAtualizarImovel.checkboxAnexoListener(i.index, pm)}"/>-->

                                        <div class="my-simple-gallery" >
                                            <figure itemprop="associatedMedia" class="grid_3 test">
                                                <a href="#{managerImagem.urlImagem(an.vlrAlteracao)}" 
                                                   itemprop="contentUrl" data-size="#{managerImagem.widthHeight(an.vlrAlteracao)}">
                                                    <img src="#{managerImagem.urlThumbnailImagem(an.vlrAlteracao)}" 
                                                         itemprop="thumbnail" class="image"/>
                                                </a>
                                                <figcaption itemprop="caption description">#{an.vlrAlteracao.nomeExibicao}</figcaption>
                                            </figure>
                                        </div>
                                    </ui:repeat>
                                    <div class="clear"/>
                                </fieldset>

                                <fieldset style="#{pm.conjugeIncluido eq null ? 'display: none;' : ''}">                                 
                                    <legend>Conjuge Incluído</legend>
                                    <p:panel styleClass="container_24 clearfix">

                                        <p:outputLabel value="Nome" styleClass="grid_2" />
                                        <p:inputText  styleClass="grid_15" 
                                                      value="#{pm.conjugeIncluido.vlrAlteracao.nome.concat(' - '.concat(pm.conjugeIncluido.vlrAlteracao.formatedDocument()))}" readonly="true" />
                                        <p:commandButton oncomplete="dlgProp.show()" icon="ui-icon-search" styleClass="grid_1"
                                                         update=":proprietarioForm" style="margin-left: -5px">
                                            <f:setPropertyActionListener target="#{managerProprietario.proprietario}" value="#{pm.conjugeIncluido.vlrAlteracao}" />
                                            <f:setPropertyActionListener target="#{managerProprietario.readonly}" value="#{true}" />
                                        </p:commandButton>
                                        <p:outputLabel value="Usar Conjuge" style="font-weight: bold;"/>
                                        <p:selectBooleanCheckbox value="#{pm.usarConjugeIncluido}" styleClass="prefix_1 grid_1"/>

                                    </p:panel>
                                </fieldset>

                                <br/>
                                <div style="#{pm.conjugeMerge eq null or (pm.conjugeMerge ne null and !pm.conjugeMerge.temDiferenca) ? 'display: none;' : ''}">
                                    <fieldset style="#{pm.conjugeMerge eq null ? 'display: none;' : ''}" >
                                        <legend>Conjuge</legend>
                                    </fieldset>

                                    <ui:repeat value="#{pm.conjugeMerge.campos}" var="campo">
                                        <comps:displayDiff campo="#{campo}"/>
                                    </ui:repeat>

                                    <fieldset style="#{pm.conjugeMerge.enderecoIncluido eq null ? 'display: none;' : ''}">                                 
                                        <legend>Endereço Incluído - Cônjuge</legend>
                                        <p:panel styleClass="container_24 clearfix">

                                            <p:outputLabel value="CEP" styleClass="grid_3"/>
                                            <p:inputMask styleClass="grid_4" mask="99.999-999"
                                                         value="#{pm.conjugeMerge.enderecoIncluido.cep}" readonly="true" />

                                            <p:outputLabel value="Usar este endereço" style="font-weight: bold;" styleClass="prefix_5 grid_5"/>
                                            <p:selectBooleanCheckbox value="#{pm.usarEndConjIncluido}" styleClass="grid_1"/>
                                            <div class="clear-both" />

                                            <p:outputLabel value="Logradouro" styleClass="grid_3" />
                                            <p:inputText styleClass="grid_19" readonly="true"
                                                         value="#{pm.conjugeMerge.enderecoIncluido.nomeclog eq null or pm.conjugeMerge.enderecoIncluido.nomeclog eq '' ? 
                                                                  pm.conjugeMerge.enderecoIncluido.logradouro : pm.conjugeMerge.enderecoIncluido.nomeclog}" />

                                            <div class="clear"/>
                                            <p:outputLabel value="Bairro" styleClass="grid_3" />
                                            <p:inputText styleClass="grid_19" readonly="true"
                                                         value="#{pm.conjugeMerge.enderecoIncluido.bairroDne.nome}" />

                                            <p:outputLabel value="Número" styleClass="grid_3" />
                                            <p:inputText styleClass="grid_4" readonly="true"
                                                         value="#{pm.conjugeMerge.enderecoIncluido.numero}" />

                                            <p:outputLabel value="Complemento" styleClass="grid_5 alpha"/>
                                            <p:inputText styleClass="grid_10" readonly="true"
                                                         value="#{pm.conjugeMerge.enderecoIncluido.compl}" />
                                        </p:panel>
                                    </fieldset>

                                    <fieldset style="#{(pm.conjugeMerge.cEndereco eq null or (pm.conjugeMerge.cEndereco ne null and pm.conjugeMerge.cEndereco.size() eq 0)) ? 'display: none;' : ''}">
                                        <legend>Endereço - Cônjuge</legend>
                                        <div class="clear"/>
                                        <ui:repeat value="#{pm.conjugeMerge.cEndereco}" var="campo">
                                            <comps:displayDiff campo="#{campo}"/>
                                        </ui:repeat>
                                    </fieldset>

                                    <fieldset style="#{pm.conjugeMerge.anexosIncluidos.size() eq 0 ? 'display: none;' : ''}">
                                        <legend>Anexos Incluídos - Cônjuge</legend>

                                        <ui:repeat  value="#{pm.conjugeMerge.anexosIncluidos}" var="a">
                                            <p:selectBooleanCheckbox value="#{a.usarAlteracao}" styleClass="ui-button button-select" />
                                            <div class="my-simple-gallery" >
                                                <figure itemprop="associatedMedia" class="grid_3 test">
                                                    <a href="#{managerImagem.urlImagem(a.vlrAlteracao)}" 
                                                       itemprop="contentUrl" data-size="#{managerImagem.widthHeight(a.vlrAlteracao)}">
                                                        <img src="#{managerImagem.urlThumbnailImagem(a.vlrAlteracao)}" 
                                                             itemprop="thumbnail" class="image"/>
                                                    </a>
                                                    <figcaption itemprop="caption description">#{a.vlrAlteracao.nomeExibicao}</figcaption>
                                                </figure>
                                            </div>
                                        </ui:repeat>
                                        <div class="clear"/>
                                    </fieldset>
                                </div>
                                <br/>
                            </div>
                        </ui:repeat>
                    </div>

                </p:panel>

                <br/>
                <br/>

                <div class="buttonAction">
                    <p:commandButton value="Atualizar" icon="ui-icon-disk" update="@form" actionListener="#{managerAtualizarImovel.atualizar()}" />
                    <p:commandButton value="Voltar" icon="ui-icon-arrowreturnthick-1-w" actionListener="#{managerAtualizarImovel.voltar()}"/>
                </div>

            </h:form>

            <!-- Dialog cadastro proprietario -->
            <h:form id="proprietarioForm" enctype="multipart/form-data">
                <p:dialog id="dlgProp" widgetVar="dlgProp" height="500" width="1000" appendToBody="false"
                          modal="true" styleClass="container_24 clearfix"
                          closeOnEscape="true" closable="true">
                    <br/>
                    <h3 class="title" >Contribuinte</h3>
                    <ui:include src="proprietarioform.xhtml"/>

                    <div class="buttonAction">
                        <p:commandButton value="Fechar" icon="ui-icon-close" oncomplete="dlgProp.hide()"/>
                    </div>
                    <script>
                        $(document).ready(function() {
                            $('#proprietarioForm\\:estadoCivilOutputlabel').removeClass('estadoCivilLabel');
                            $('#proprietarioForm\\:localTrabalhoOutputlabel').removeClass('localTrabalhoLabel');
                            $('#proprietarioForm\\:conjuge').removeClass('autocompleteConjuge');
                            $('#proprietarioForm\\:conjuge').addClass('autocompleteConjugeDlg');
                            $('#proprietarioForm\\:localTrabalhoOutputlabel').removeClass('localTrabalhoLabel');
                            $('#proprietarioForm\\:localTrabalhoOutputlabel').addClass('localTrabalhoLabelDlg');
                            $('#proprietarioForm\\:localTrabalhoInputText').removeClass('localTrabalhoInputTextContribuinte');
                            $('#proprietarioForm\\:localTrabalhoInputText').addClass('localTrabalhoInputTextContribuinteDlg');
                            
                        });
                        
                    </script>
                </p:dialog>

            </h:form>

            <div id="divGaleria" class="pswp" tabindex="-1" role="dialog" aria-hidden="true">

                <div class="pswp__bg"></div>

                <div class="pswp__scroll-wrap">

                    <div class="pswp__container">
                        <div class="pswp__item"></div>
                        <div class="pswp__item"></div>
                        <div class="pswp__item"></div>
                    </div>

                    <div class="pswp__ui pswp__ui--hidden">

                        <div class="pswp__top-bar">

                            <div class="pswp__counter"></div>

                            <button class="pswp__button pswp__button--close" title="Fechar (Esc)"></button>
                            <button class="pswp__button pswp__button--fs" title="Tela Cheia"></button>
                            <button class="pswp__button pswp__button--zoom" title="Zoom +/-"></button>

                            <div class="pswp__preloader">
                                <div class="pswp__preloader__icn">
                                    <div class="pswp__preloader__cut">
                                        <div class="pswp__preloader__donut"></div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                            <div class="pswp__share-tooltip"></div> 
                        </div>



                        <button class="pswp__button pswp__button--arrow--left" title="Anterior (seta esquerda)">
                        </button>

                        <button class="pswp__button pswp__button--arrow--right" title="Próximo (seta direita)">
                        </button>

                        <div class="pswp__caption">
                            <div class="pswp__caption__center"></div>
                        </div>

                    </div>

                </div>

            </div>


            <script src='media/js/photoswipe.min.js'></script>
            <script src='media/js/photoswipe-ui-default.min.js'></script>

            <script src="media/js/index.js"></script>

        </ui:define>
    </ui:composition>
</html>

